﻿$(function() {
	/**
	 * 电度电费
	 * */
	var daypie = echarts.init(document.getElementById('daypie'));
	optionpie = {
		    tooltip: {
		        trigger: 'item',
		        formatter: "{a} <br/>{b}: {c} ({d}%)"
		    },
		    backgroundColor:'#e0e0e0',
		    legend: {
		        orient: 'vertical',
		        x: 'right',
		        data:[]
		    },
		    series: [{
	            name:'电费',
	            type:'pie',
	            radius: [0, '40%'],
	            label: {
	                normal: {
	                    position: 'inside'
	                }
	            },
	            data:[]
	        },{
	            name:'电度',
	            type:'pie',
	            radius: ['55%', '80%'],
	            data:[]
	        }]
		};
	daypie.setOption(optionpie);
	
	/**
	 * 有功电度
	 * */
    var dayline = echarts.init(document.getElementById('dayline'));
    optionline = {
        tooltip : {
            trigger: 'axis',
            axisPointer: {
		        type: 'shadow'
		    }
        },
        backgroundColor:'#e0e0e0',
        grid: {
            top: '15%',
            left: '4%',
            right: '5%',
            bottom:'20%',
            containLabel: true
        },
        legend: {
        	bottom: '20',
	        data:['有功电度']
	    },
        xAxis:  {
            type: 'category',
            boundaryGap: [1, 1],
            data: [],
            splitLine:{
            	show:false
            }
        },
        yAxis: {
            type: 'value',
            name:'电度趋势(度)',
            axisLabel:{
	    		 formatter: '{value}'
	    	 },
            splitLine:{
            	show:false
            }
        },
        dataZoom:{
	    	type:'slider',
	    	start:0,
	    	end:100,
	    	bottom:1
	    },
        series: [{
             name:'有功电度',
             type:'line',
             data:[],
             markPoint: {
                 data: [
                     {type: 'max', name: '最高电度'},
                     {type: 'min', name: '最低电度'}
                 ]
             }
         }]
    };
    dayline.setOption(optionline);
    
    /**
     * 电度
     * */
    var daybar = echarts.init(document.getElementById('daybar'));
	optionBar = {
		    tooltip: {
		        trigger: 'axis',
		        axisPointer: {
		            type: 'shadow'
		        }
		    },
		    backgroundColor:'#e0e0e0',
		    legend: {
		    	bottom: '30',
		        data: ['班次电度']
		    },
		    grid: {
	            top: '10%',
	            left: '4%',
	            right: '4%',
	            bottom:'20%',
	            containLabel: true
	        },
		    xAxis: {
		        type: 'value',
		        boundaryGap: [0, 0.01],
		        nameLocation:'end',
			        axisLabel : {
	                formatter: '{value}'
	            },
	            splitLine:{
	            	show:false
	            }
		    },
		    yAxis: {
		        type: 'category',
		        name : '班次',
		        data:[],//['早班','晚班'], 
		        axisLabel : {
	                formatter: '{value}'
	            },
	            splitLine:{
	            	show:false
	            }
		    },
		    series: [{
	            name: '班次电度',
	            type: 'bar',
	            barMaxWidth:40,
	            label: {
	                normal: {
	                    show: true,
	                    formatter: '{c}度',
	                    position: 'right'
	                }
	            },
	            data:[]
	        }]
		};
	daybar.setOption(optionBar);
    /**
     * 初始化
     * */
    var vm = new Vue({
	    el: '#itemData',
	    data:{item:[]}
	}); 
    var lineId=0;
    $('#ss').slider('setValue',parseInt(moment().format("x")));
    var getsliderTime=$('#ss').slider('getValue');
	var	time=moment(getsliderTime).format("YYYY-MM-DD");
	getData();
    function getData(){
    	$.post(basePath+"/line/lineDay/electricity.json",{"lineId":lineId,belongDate:time},function(res){
    		vm.$set('item',res);
    		if(res.success){
    			daypie.setOption({
    				legend: {
    			        data:res.pieLegend
    			    },
    			    series:[{
    			    	name:'电费',
    			    	data:res.chargePie
    			    },{
    			    	name:'电度',
    			    	data:res.electricityPie
    			    }]
    			});
    			dayline.setOption({
			        xAxis: {
			            data: res.hours
			        },
			        series: [{
			            data: res.hourRelativeComp
			        }]
    			});
    			daybar.setOption({
			        yAxis: {
			            data: res.shifts
			        },
			        series: [{
			            data: res.shiftRelativeComp
			        }]
    			});
    		}else{
    			alert(res.msg);
    			daypie.setOption({
    				legend: {
    			        data:['电费','电度']
    			    },
    			    series:[{
    			    	name:'电费',
    			    	data:[{name:'电费',value:0}]
    			    },{
    			    	name:'电度',
    			    	data:[{name:'电度',value:0}]
    			    }]
    			});
    			dayline.setOption({
			        xAxis: {
			            data: ["无数据"]
			        },
			        series: [{
			            data: [0]
			        }]
    			});
    			daybar.setOption({
			        yAxis: {
			            data: ["无班次"]
			        },
			        series: [{
			            data: [0]
			        }]
    			});
    		}	
    	});
    }
    
    /**
     * slider滑动事件
     * */
    $('#ss').slider({
       onComplete:function(value){//滑块值改变时触发
       	time=moment(value).format('YYYY-MM-DD');
       	getData();
       }
    });
    
    /**
     * 自定义时间按钮的点击事件
     * */
	 $("#defineTime").click(function (){
		 var mePanel = $('#defineTimeWin');
	   	 mePanel.dialog('open');
	 });
	 
	 /**
	  * 切换设备的点击事件
	  * */
	var mePanel = $('#switchEquip');
	$("#linetree").tree({
		onDblClick: function(node) {
			if (node.url) {
				if(node.shifts){
					lineId=node.id;
					time=moment($('#ss').slider('getValue')).format("YYYY-MM-DD");
		    		getData();
					mePanel.dialog('close');
				}else{
					$.messager.alert({showSpeed:100,title:'消息提示',msg:'该生产线无班次，请重新选择',timeout:3000});
				}
			}else{
				$.messager.alert({showSpeed:100,title:'消息提示',msg:'请选择生产线！',timeout:3000});
			}
		}
	});
    $("#switchEquipOK").click(function(){
    	var row = $("#linetree").tree('getSelected');
    	if(row.url){
    		if(row.shifts){
    			lineId=row.id;
    			time=moment($('#ss').slider('getValue')).format("YYYY-MM-DD");
    			getData();
    			$('#switchEquip').dialog('close');
    		}else{
				$.messager.alert({showSpeed:100,title:'消息提示',msg:'该生产线无班次，请重新选择',timeout:3000});
			}
    	}else{
       		$.messager.alert({showSpeed:100,title:'消息提示',msg:'请选择一条生产线!',timeout:3000});
       	}
    });
});